// Dropdown 下拉

$e-dropdown-menu-widths: (
    sm: 240px,
    md: 260px,
    lg: 320px
);

.dropdown-menu {
    border: 0 !important;
    margin: 0;
    border-radius: 0;
    min-width: 14rem;
    box-shadow: $dropdown-box-shadow;
    padding: 1rem 0;

    // Fit options
    &.dropdown-menu-fit {
        padding: 0;
    }

    &.dropdown-menu-fit-bottom {
        padding-bottom: 0;
    }

    &.dropdown-menu-fit-top {
        padding-top: 0;
    }

    &.dropdown-menu-fit:not(.dropdown-menu-top-unround) {
        > div:first-of-type {
            @include e-rounded {
                border-top-left-radius: $e-border-radius;
                border-top-right-radius: $e-border-radius;
            }
        }

        @include e-rounded {
            form {
                border-top-left-radius: $e-border-radius;
                border-top-right-radius: $e-border-radius;
            }
        }
    }

    @include e-rounded {
        border-radius: $e-border-radius;

        &.dropdown-menu-top-unround {
            border-top-left-radius: 0;
            border-top-right-radius: 0;
        }
    }

    &:before,
    &:after {
        display: none !important;
    }

    > li > a,
    > .dropdown-item {
        outline: none !important;
        display: flex;
        flex-grow: 1;
        padding: .7rem 1.2rem;

        @include e-icons-size((lineawesome: 1.4rem, fontawesome: 1.4rem, flaticon: 1.3rem));

        > i {
            margin-right: .75rem;
            color: e-base-color(label, 2);

            &:before {
                line-height: 0;
                vertical-align: middle;
            }
        }
    }

    .dropdown-divider {
        border-top: 1px solid e-base-color(grey, 2);
    }

    @each $name, $width in $e-dropdown-menu-widths {
        &.dropdown-menu-#{$name} {
            width: $width;
        }
    }

    // 动画
    &.dropdown-menu-anim {
        animation: dropdown-menu-fade-in .3s ease 1, dropdown-menu-move-up .3s ease-out 1;
    }

    .drop-up &,
    .dropdown-menu-anim-down {
        &.dropdown-menu-anim {
            animation: dropdown-menu-fade-in .3s ease 1, dropdown-menu-move-down .3s ease-out 1;
        }
    }

    // mobile mode
    @include e-mobile {
        &.dropdown-menu-lg,
        &.dropdown-menu-md {
            width: 300px;
        }
    }
}

// Dropdown toggle
.nav-link.dropdown-toggle,
.btn.dropdown-toggle {
    &:after {
        text-align: center;
        display: inline;
        border: 0;
        font-size: .6rem;
        line-height: 0;
        vertical-align: middle;
        position: relative;
        margin-left: .5rem#{'/*rtl:ignore*/'};
        opacity: .7;

        @include e-flaticon2-icon(e-get($e-action-bold-icons, down));
    }

    &.dropdown-toggle-split {
        &:after {
            right: 1px;
        }
    }
}

//设置按钮为inline-block
.dropdown.dropdown-inline {
    display: inline-block;
}

// 箭头方向
.dropup {
    .nav-link.dropdown-toggle,
    .btn.dropdown-toggle {
        &:after {
            @include e-flaticon2-icon(e-get($e-action-bold-icons, up));
        }
    }
}

.btn-group.dropright {
    .nav-link.dropdown-toggle,
    .btn.dropdown-toggle {
        &:before {
            display: none;
        }

        &:after {
            @include e-flaticon2-icon(e-get($e-action-bold-icons, right));
        }
    }
}

.btn-group.dropleft {
    .nav-link.dropdown-toggle,
    .btn.dropdown-toggle {
        &:before {
            display: none;
        }

        &:after {
            @include e-flaticon2-icon(e-get($e-action-bold-icons, left));
        }
    }
}

// 动画
@keyframes dropdown-menu-fade-in {
    from   { opacity: 0; }
    to { opacity: 1; }
}

@keyframes dropdown-menu-move-down {
    from   { margin-top: -10px }
    to { margin-top: 0; }
}

@keyframes dropdown-menu-move-up {
    from   { margin-top: 10px }
    to { margin-top: 0; }
}